<mat-sidenav-container [(class.myapp-dark-theme)]="darktheme">
  <!-- mode拥有的样式side/push/over，默认over -->
  <!-- position start->左边 end->右边 -->
  <mat-sidenav #sidenav mode="over" position="start">
    <app-sidebar></app-sidebar>
  </mat-sidenav>
  <mat-sidenav-content>
    <div class="site">
      <header>
        <!-- sidenav.toggle来回切换样式 -->
        <!-- 监听toggle事件 -->
        <!-- 要接受参数的值一定要写$event,其它的不会生效 -->
        <app-header (toggle)="sidenav.toggle()" (toggleDarkTheme)="switchTheme($event)"></app-header>
      </header>
      <main>
        <router-outlet></router-outlet>
      </main>
      <footer>
        <app-footer></app-footer>
      </footer>
    </div>
  </mat-sidenav-content>
</mat-sidenav-container>
